<template>
    <div class="myPublish-container">
        <!-- 面包屑 -->
        <Breadcrumb>
            <BreadcrumbItem to="/userHome">个人中心</BreadcrumbItem>
            <BreadcrumbItem>订单管理</BreadcrumbItem>
            <BreadcrumbItem>我卖出的</BreadcrumbItem>
        </Breadcrumb>
        <div class="myPublish-info">
            <Tabs value="name1">
                <!-- 全部列表 -->
                <TabPane label="全部" name="name1">
                    <div class="myPublish-list" v-if="sellList==''">
                        <a-empty style="padding-top:70px;"></a-empty>
                    </div>
                    <div class="myPublish-list" v-else>
                        <div class="myPublish-item" v-for="(item,i) in sellList" :key="i">
                            <!-- 订单信息 -->
                            <div class="userinfo-order">
                                <div class="userinfo">
                                    <span>订单编号：{{item.oOrderNum}}</span>
                                </div>
                                <div class="order-status" v-if="item.oOrderStatus==1">
                                    <span class="order-status">等待买家付款</span>
                                </div>
                                <div class="order-status" v-else-if="item.oOrderStatus==2">
                                    <span class="order-status">等待卖家发货</span>
                                </div>
                                <div class="order-status" v-else-if="item.oOrderStatus==3">
                                    <span class="order-status">等待买家收货</span>
                                </div>
                                <div class="order-status" v-else-if="item.oOrderStatus==4">
                                    <span class="order-status">交易成功</span>
                                </div>
                                <div class="order-status" v-else-if="item.oOrderStatus==5">
                                    <span class="order-status">退款中</span>
                                </div>
                                <div class="order-status" v-else-if="item.oOrderStatus==0">
                                    <span class="order-status">交易关闭</span>
                                </div>
                                <div class="order-status" v-else-if="item.oOrderStatus==6">
                                    <span class="order-status">退款成功</span>
                                </div>
                            </div>
                            <!-- 商品价格区域 -->
                            <div class="goodsinfo-price">
                                <div class="goodsinfo">
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)"><img :src="item.mainPic" alt=""></a>
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)">{{item.goods.gTitle}}</a>
                                </div>
                                <div class="realy-price">
                                    <span>实收款：<span class="price">￥{{item.oTotalAmount}}</span></span>
                                </div>
                            </div>
                            <!-- 联系买家 -->
                            <div class="info-place">
                                <router-link :to="'/addPrivateMsg/' + item.oUid + '/' + item.oGid" class="user-msg-img"><img :src="item.users.uAvatar" alt=""> 联系买家</router-link>
                                <div class="order-place">
                                    <a-popconfirm v-if="item.oOrderStatus===2"
                                        title="确认发货？"
                                        @confirm="goDeliver(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="detail">去发货</a>
                                    </a-popconfirm>
                                    <a-popconfirm v-if="item.oOrderStatus===1 || item.oOrderStatus===2"
                                        title="确认取消订单？"
                                        @confirm="cancelOrder(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="cancel">取消订单</a>
                                    </a-popconfirm>
                                    <a-popconfirm v-if="item.oOrderStatus===0 || item.oOrderStatus===4"
                                        title="确认删除订单？"
                                        @confirm="deleteById(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="cancel">删除订单</a>
                                    </a-popconfirm>
                                    <a href="javascript:void(0);" class="cancel" @click.prevent="findRefundDetail(item.oId)" v-if="item.oOrderStatus==5 || item.oOrderStatus===6">退款详情</a>
                                </div>
                            </div>
                        </div>
                        <div class="page-all">
                            <Page :total="allPages.total" :page-size="pageSize" :current="pageNum" @on-change="changePage"  />
                        </div>
                    </div>
                </TabPane>
                <!-- 待付款列表 -->
                <TabPane label="待付款" name="name2">
                    <div class="myPublish-list" v-if="notPayList==''">
                        <a-empty style="padding-top:70px;"></a-empty>
                    </div>
                    <div class="myPublish-list" v-else>
                        <div class="myPublish-item" v-for="(item,i) in notPayList" :key="i">
                            <!-- 订单信息 -->
                            <div class="userinfo-order">
                                <div class="userinfo">
                                    <span>订单编号：{{item.oOrderNum}}</span>
                                </div>
                                <div class="order-status" v-if="item.oOrderStatus==1">
                                    <span class="order-status">等待买家付款</span>
                                </div>
                            </div>
                            <!-- 商品价格区域 -->
                            <div class="goodsinfo-price">
                                <div class="goodsinfo">
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)"><img :src="item.mainPic" alt=""></a>
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)">{{item.goods.gTitle}}</a>
                                </div>
                                <div class="realy-price">
                                    <span>实收款：<span class="price">￥{{item.oTotalAmount}}</span></span>
                                </div>
                            </div>
                            <!-- 联系买家 -->
                            <div class="info-place">
                                <router-link :to="'/addPrivateMsg/' + item.oUid + '/' + item.oGid" class="user-msg-img"><img :src="item.users.uAvatar" alt=""> 联系买家</router-link>
                                <div class="order-place">
                                    <a-popconfirm
                                        title="确认取消订单？"
                                        @confirm="cancelOrder(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="cancel">取消订单</a>
                                    </a-popconfirm>
                                </div>
                            </div>
                        </div>
                        <div class="page-all">
                            <Page :total="allPagesTwo.total" :page-size="pageSize" :current="pageNumTwo" @on-change="changePageTwo"  />
                        </div>
                    </div>
                </TabPane>
                <!-- 待发货列表 -->
                <TabPane label="待发货" name="name3">
                    <div class="myPublish-list" v-if="waitDeleverList==''">
                        <a-empty style="padding-top:70px;"></a-empty>
                    </div>
                    <div class="myPublish-list" v-else>
                        <div class="myPublish-item" v-for="(item,i) in waitDeleverList" :key="i">
                            <!-- 订单信息 -->
                            <div class="userinfo-order">
                                <div class="userinfo">
                                    <span>订单编号：{{item.oOrderNum}}</span>
                                </div>
                                <div class="order-status" v-if="item.oOrderStatus==2">
                                    <span class="order-status">等待卖家发货</span>
                                </div>
                            </div>
                            <!-- 商品价格区域 -->
                            <div class="goodsinfo-price">
                                <div class="goodsinfo">
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)"><img :src="item.mainPic" alt=""></a>
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)">{{item.goods.gTitle}}</a>
                                </div>
                                <div class="realy-price">
                                    <span>实收款：<span class="price">￥{{item.oTotalAmount}}</span></span>
                                </div>
                            </div>
                            <!-- 联系买家 -->
                            <div class="info-place">
                                <router-link :to="'/addPrivateMsg/' + item.oUid + '/' + item.oGid" class="user-msg-img"><img :src="item.users.uAvatar" alt=""> 联系买家</router-link>
                                <div class="order-place">
                                    <a-popconfirm v-if="item.oOrderStatus===2"
                                        title="确认发货？"
                                        @confirm="goDeliver(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="detail">去发货</a>
                                    </a-popconfirm>
                                    <a-popconfirm
                                        title="确认取消订单？"
                                        @confirm="cancelOrder(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="cancel">取消订单</a>
                                    </a-popconfirm>
                                </div>
                            </div>
                        </div>
                        <div class="page-all">
                            <Page :total="allPagesThree.total" :page-size="pageSize" :current="pageNumThree" @on-change="changePageThree"  />
                        </div>
                    </div>
                </TabPane>
                <!-- 待收货列表 -->
                <TabPane label="待收货" name="name4">
                    <div class="myPublish-list" v-if="waitConfirmGoods==''">
                        <a-empty style="padding-top:70px;"></a-empty>
                    </div>
                    <div class="myPublish-list" v-else>
                        <div class="myPublish-item" v-for="(item,i) in waitConfirmGoods" :key="i">
                            <!-- 订单信息 -->
                            <div class="userinfo-order">
                                <div class="userinfo">
                                    <span>订单编号：{{item.oOrderNum}}</span>
                                </div>
                                <div class="order-status" v-if="item.oOrderStatus==3">
                                    <span class="order-status">等待买家收货</span>
                                </div>
                            </div>
                            <!-- 商品价格区域 -->
                            <div class="goodsinfo-price">
                                <div class="goodsinfo">
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)"><img :src="item.mainPic" alt=""></a>
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)">{{item.goods.gTitle}}</a>
                                </div>
                                <div class="realy-price">
                                    <span>实收款：<span class="price">￥{{item.oTotalAmount}}</span></span>
                                </div>
                            </div>
                            <!-- 联系买家 -->
                            <div class="info-place">
                                <router-link :to="'/addPrivateMsg/' + item.oUid + '/' + item.oGid" class="user-msg-img"><img :src="item.users.uAvatar" alt=""> 联系买家</router-link>
                                <div class="order-place">
                                </div>
                            </div>
                        </div>
                        <div class="page-all">
                            <Page :total="allPagesFour.total" :page-size="pageSize" :current="pageNumFour" @on-change="changePageFour"  />
                        </div>
                    </div>
                </TabPane>
                <!-- 退款中列表 -->
                <TabPane label="退款中" name="name5">
                    <div class="myPublish-list" v-if="refundIngList==''">
                        <a-empty style="padding-top:70px;"></a-empty>
                    </div>
                    <div class="myPublish-list" v-else>
                        <div class="myPublish-item" v-for="(item,i) in refundIngList" :key="i">
                            <!-- 订单信息 -->
                            <div class="userinfo-order">
                                <div class="userinfo">
                                    <span>订单编号：{{item.oOrderNum}}</span>
                                </div>
                                <div class="order-status" v-if="item.oOrderStatus==5">
                                    <span class="order-status">退款申请中</span>
                                </div>
                            </div>
                            <!-- 商品价格区域 -->
                            <div class="goodsinfo-price">
                                <div class="goodsinfo">
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)"><img :src="item.mainPic" alt=""></a>
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)">{{item.goods.gTitle}}</a>
                                </div>
                                <div class="realy-price">
                                    <span>实收款：<span class="price">￥{{item.oTotalAmount}}</span></span>
                                </div>
                            </div>
                            <!-- 联系买家 -->
                            <div class="info-place">
                                <router-link :to="'/addPrivateMsg/' + item.oUid + '/' + item.oGid" class="user-msg-img"><img :src="item.users.uAvatar" alt=""> 联系买家</router-link>
                                <div class="order-place">
                                    <a href="javascript:void(0);" class="cancel" @click.prevent="findRefundDetail(item.oId)" v-if="item.oOrderStatus==5">退款详情</a>
                                </div>
                            </div>
                        </div>
                        <div class="page-all">
                            <Page :total="allPagesFive.total" :page-size="pageSize" :current="pageNumFive" @on-change="changePageFive"  />
                        </div>
                    </div>
                </TabPane>
                <!-- 已取消列表 -->
                <TabPane label="已取消" name="name6">
                    <div class="myPublish-list" v-if="cancelList==''">
                        <a-empty style="padding-top:70px;"></a-empty>
                    </div>
                    <div class="myPublish-list" v-else>
                        <div class="myPublish-item" v-for="(item,i) in cancelList" :key="i">
                            <!-- 订单信息 -->
                            <div class="userinfo-order">
                                <div class="userinfo">
                                    <span>订单编号：{{item.oOrderNum}}</span>
                                </div>
                                <div class="order-status" v-if="item.oOrderStatus==0">
                                    <span class="order-status">交易关闭</span>
                                </div>
                            </div>
                            <!-- 商品价格区域 -->
                            <div class="goodsinfo-price">
                                <div class="goodsinfo">
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)"><img :src="item.mainPic" alt=""></a>
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)">{{item.goods.gTitle}}</a>
                                </div>
                                <div class="realy-price">
                                    <span>实收款：<span class="price">￥{{item.oTotalAmount}}</span></span>
                                </div>
                            </div>
                            <!-- 联系买家 -->
                            <div class="info-place">
                                <router-link :to="'/addPrivateMsg/' + item.oUid + '/' + item.oGid" class="user-msg-img"><img :src="item.users.uAvatar" alt=""> 联系买家</router-link>
                                <div class="order-place">
                                    <a-popconfirm
                                        title="确认删除订单？"
                                        @confirm="deleteById(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="cancel">删除订单</a>
                                    </a-popconfirm>
                                </div>
                            </div>
                        </div>
                        <div class="page-all">
                            <Page :total="allPagesSix.total" :page-size="pageSize" :current="pageNumSix" @on-change="changePageSix"  />
                        </div>
                    </div>
                </TabPane>
                <!-- 已退款列表 -->
                <TabPane label="已退款" name="name7">
                    <div class="myPublish-list" v-if="refundedList==''">
                        <a-empty style="padding-top:70px;"></a-empty>
                    </div>
                    <div class="myPublish-list" v-else>
                        <div class="myPublish-item" v-for="(item,i) in refundedList" :key="i">
                            <!-- 订单信息 -->
                            <div class="userinfo-order">
                                <div class="userinfo">
                                    <span>订单编号：{{item.oOrderNum}}</span>
                                </div>
                                <div class="order-status" v-if="item.oOrderStatus==6">
                                    <span class="order-status">退款成功</span>
                                </div>
                            </div>
                            <!-- 商品价格区域 -->
                            <div class="goodsinfo-price">
                                <div class="goodsinfo">
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)"><img :src="item.mainPic" alt=""></a>
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)">{{item.goods.gTitle}}</a>
                                </div>
                                <div class="realy-price">
                                    <span>实收款：<span class="price">￥{{item.oTotalAmount}}</span></span>
                                </div>
                            </div>
                            <!-- 联系买家 -->
                            <div class="info-place">
                                <router-link :to="'/addPrivateMsg/' + item.oUid + '/' + item.oGid" class="user-msg-img"><img :src="item.users.uAvatar" alt=""> 联系买家</router-link>
                                <div class="order-place">
                                    <a href="javascript:void(0);" class="cancel" @click.prevent="findRefundDetail(item.oId)" v-if="item.oOrderStatus==5 || item.oOrderStatus===6">退款详情</a>
                                    <a-popconfirm
                                        title="确认删除订单？"
                                        @confirm="deleteById(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="cancel">删除订单</a>
                                    </a-popconfirm>
                                </div>
                            </div>
                        </div>
                        <div class="page-all">
                            <Page :total="allPagesSeven.total" :page-size="pageSize" :current="pageNumSeven" @on-change="changePageSeven"  />
                        </div>
                    </div>
                </TabPane>
                <!-- 交易成功列表 -->
                <TabPane label="交易成功" name="name8">
                    <div class="myPublish-list" v-if="successList==''">
                        <a-empty style="padding-top:70px;"></a-empty>
                    </div>
                    <div class="myPublish-list" v-else>
                        <div class="myPublish-item" v-for="(item,i) in successList" :key="i">
                            <!-- 订单信息 -->
                            <div class="userinfo-order">
                                <div class="userinfo">
                                    <span>订单编号：{{item.oOrderNum}}</span>
                                </div>
                                <div class="order-status" v-if="item.oOrderStatus==4">
                                    <span class="order-status">交易成功</span>
                                </div>
                            </div>
                            <!-- 商品价格区域 -->
                            <div class="goodsinfo-price">
                                <div class="goodsinfo">
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)"><img :src="item.mainPic" alt=""></a>
                                    <a href="javascript:void(0);" class="detail" @click.prevent="findOrderDetail(item.oId)">{{item.goods.gTitle}}</a>
                                </div>
                                <div class="realy-price">
                                    <span>实收款：<span class="price">￥{{item.oTotalAmount}}</span></span>
                                </div>
                            </div>
                            <!-- 联系买家 -->
                            <div class="info-place">
                                <router-link :to="'/addPrivateMsg/' + item.oUid + '/' + item.oGid" class="user-msg-img"><img :src="item.users.uAvatar" alt=""> 联系买家</router-link>
                                <div class="order-place">
                                    <a-popconfirm
                                        title="确认删除订单？"
                                        @confirm="deleteById(item.oId)"
                                        okText="Yes"
                                        cancelText="No">
                                        <a href="javascript:void(0)" class="cancel">删除订单</a>
                                    </a-popconfirm>
                                </div>
                            </div>
                        </div>
                        <div class="page-all">
                            <Page :total="allPagesEight.total" :page-size="pageSize" :current="pageNumEight" @on-change="changePageEight"  />
                        </div>
                    </div>
                </TabPane>
            </Tabs>
            <!-- 订单详情 -->
            <Modal
                v-model="modal1"
                title="订单详情">
                <div class="order-info">
                    <h6>订单信息</h6>
                    <div class="order-detail">
                        <p>订单编号：{{orderDetail.oOrderNum}}</p>
                        <p>收货人：
                            <span class="pad">{{addrDetail.raFullname}}</span>
                            <span class="pad">{{addrDetail.raPhone}}</span>
                            <span>{{addrDetail.raAddr}}</span>
                        </p>
                        <p v-if="orderDetail.oOrderStatus==1">订单状态：等待卖家付款</p>
                        <p v-if="orderDetail.oOrderStatus==2">订单状态：等待卖家发货</p>
                        <p v-if="orderDetail.oOrderStatus==3">订单状态：等待买家收货</p>
                        <p v-if="orderDetail.oOrderStatus==4">订单状态：交易成功</p>
                        <p v-if="orderDetail.oOrderStatus==5">订单状态：退款中</p>
                        <p v-if="orderDetail.oOrderStatus==6">订单状态：退款成功</p>
                        <p v-if="orderDetail.oOrderStatus==0">订单状态：交易关闭</p>
                        <p>创建时间：{{orderDetail.oCreateTime | dataFormat}}</p>
                        <p v-if="orderDetail.oPayTime!=''">支付时间：{{orderDetail.oPayTime}}</p>
                        <p>备注信息：{{orderDetail.oRemark}}</p>
                    </div>
                </div>
                <div class="order-info">
                    <h6>商品信息</h6>
                    <div class="goodsinfo-price">
                        <div class="goodsinfo">
                            <router-link :to="'/goodsInfo/' + orderDetail.oGid"><img :src="orderDetail.mainPic" alt=""></router-link>
                            <router-link :to="'/goodsInfo/' +  orderDetail.oGid" class="title">{{ orderDetail.title}}</router-link>
                        </div>
                        <div class="realy-price">
                            <span>实收款：<span class="price">￥{{orderDetail.oTotalAmount}}</span></span>
                        </div>
                    </div>
                </div>
            </Modal>
            <!-- 退款详情 -->
            <Modal
                v-model="modal2"
                title="退款详情"
                @on-ok="ok"
                @on-cancel="cancel">
                <div class="order-info">
                    <p>退款状态：{{newRefund.orStatus}}</p>
                    <p>退款金额：<span class="red">￥{{newRefund.orPrice}}</span></p>
                    <p>申请时间：{{newRefund.orCreateTime | dataFormat}}</p>
                    <p v-if="newRefund.orSuccessTime">退款时间：{{newRefund.orSuccessTime | dataFormat}}</p>
                    <p>退款原因：{{newRefund.orReason}}</p>
                    <p>退款说明：{{newRefund.orDesc}}</p>
                    <a href="javascript:void(0)" class="cancel" @click.prevent="agreeRefund" v-if="newRefund.orStatus==='退款申请中'">同意退款</a>
                </div>
            </Modal>
        </div>
    </div>
</template>

<script>
export default {
  name: 'MySellOrders',
  data () {
    return {
      uId: JSON.parse(localStorage.getItem('user')).uId,
      sellList: [], // 我卖出的全部列表
      notPayList: [], // 待付款列表
      waitDeleverList: [], // 待发货列表
      waitConfirmGoods: [], // 待收货
      refundIngList: [], // 退款中
      cancelList: [], // 已取消
      refundedList: [], // 已退款
      successList: [], // 交易成功
      modal1: false,
      modal2: false,
      newRefund: '', // 退款详情信息
      addrDetail: '', // 收货人地址详情
      orderDetail: '', // 订单详情
      pageSize: 4, // 每页显示多少条
      allPages: [], // 存放全部的信息
      pageNum: 1, // 默认展示第一页数据
      pageNumTwo: 1,
      allPagesTwo: [],
      pageNumThree: 1,
      allPagesThree: [],
      pageNumFour: 1,
      allPagesFour: [],
      pageNumFive: 1,
      allPagesFive: [],
      pageNumSix: 1,
      allPagesSix: [],
      pageNumSeven: 1,
      allPagesSeven: [],
      pageNumEight: 1,
      allPagesEight: []
    }
  },
  created () {
    this.findAllGoods()
    this.findWaitPay()
    this.findWaitOrder()
    this.findConfirmOrder()
    this.findRefundIng()
    this.findCancel()
    this.findRefunded()
    this.findSuccess()
  },
  methods: {
    ok () {
      this.findRefundIng()
      this.findAllGoods()
      this.findRefunded()
    },
    cancel () {
      this.findRefundIng()
      this.findAllGoods()
      this.findRefunded()
    },
    // 根据id查询此收货地址详情
    findAddrDetail (id) {
      this.addrDetail = ''
      this.$axios({
        url: 'receiveAddress/findById/' + id,
        method: 'get',
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.addrDetail = res.data.object
        }
      })
    },
    // 根据订单表id查询我卖出的订单详情
    findOrderDetail (id) {
      this.orderDetail = ''
      this.modal1 = true
      this.$axios({
        url: 'orders/findById/' + id,
        method: 'get',
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.orderDetail = res.data.object
          this.findAddrDetail(res.data.object.oRaid)
          this.$axios({
            url: 'goodsPicture/findMainPicByGoodsId/' + this.orderDetail.oGid,
            method: 'get'
          }).then(result => {
            if (result.data.code === 200) {
              this.$set(this.orderDetail, 'mainPic', result.data.object.gpAddress)
              this.$set(this.orderDetail, 'title', result.data.object.goods.gTitle)
            }
          }).catch(error => {
            console.log(error)
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 查询我卖出的订单列表
    findAllGoods () {
      this.$axios({
        url: 'orders/findSellList/',
        method: 'get',
        headers: {
          Authorization: localStorage.getItem('token')
        },
        params: {
          uId: this.uId,
          pageNo: this.pageNum,
          pageSize: this.pageSize
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.sellList = res.data.pageInfo.list
          this.allPages = res.data.pageInfo
          this.sellList.forEach(one => {
            this.$axios({
              url: 'goodsPicture/findMainPicByGoodsId/' + one.oGid,
              method: 'get'
            }).then(resultTwo => {
              if (resultTwo.data.code === 200) {
                this.$set(one, 'mainPic', resultTwo.data.object.gpAddress)
              }
            }).catch(error => {
              console.log(error)
            })
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 全部的分页改变页码
    changePage (index) {
      // 加载更多，页码改变的回调，返回改变后的页码
      this.pageNum = index
      this.findAllGoods()
    },
    // 去发货
    goDeliver (oId) {
      this.$axios({
        url: 'orders/updateDeliverStatus/' + oId,
        method: 'get',
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data === true) {
          this.findAllGoods()
          this.findConfirmOrder()
        } else {
          this.$Message.info('发货失败')
          this.findAllGoods()
          this.findConfirmOrder()
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 取消订单
    cancelOrder (oId) {
      this.$axios({
        url: 'orders/updateOrderClose/' + oId,
        method: 'get',
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.findAllGoods()
          this.findCancel()
        } else {
          this.$Message.info('取消订单失败')
          this.findAllGoods()
          this.findCancel()
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 根据订单id删除订单
    deleteById (oId) {
      this.$axios({
        url: 'orders/deleteById/' + oId,
        method: 'get',
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data === true) {
          this.findAllGoods()
          this.findSuccess()
          this.findRefunded()
        } else {
          this.$Message.info('删除失败')
          this.findAllGoods()
          this.findSuccess()
          this.findRefunded()
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 分页根据订单状态查询待付款订单列表
    findWaitPay () {
      this.$axios({
        url: 'orders/findByStatusBySell/',
        method: 'get',
        params: {
          uId: this.uId,
          pageNo: this.pageNumTwo,
          pageSize: this.pageSize,
          status: 1
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.notPayList = res.data.pageInfo.list
          this.allPagesTwo = res.data.pageInfo
          // 遍历订单，得到订单商品的主图
          this.notPayList.forEach(item => {
            this.$axios({
              url: 'goodsPicture/findMainPicByGoodsId/' + item.goods.gId,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'mainPic', result.data.object.gpAddress)
              }
            }).catch(error => {
              console.log(error)
            })
            this.$axios({
              url: 'users/findById/' + item.goods.gUid,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'uAvatar', result.data.object.uAvatar)
              }
            }).catch(error => {
              console.log(error)
            })
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 待付款分页
    changePageTwo (index) {
      // 加载更多，页码改变的回调，返回改变后的页码
      this.pageNumTwo = index
      this.findWaitPay()
    },
    // 分页根据订单状态查询待发货订单列表
    findWaitOrder () {
      this.$axios({
        url: 'orders/findByStatusBySell/',
        method: 'get',
        params: {
          uId: this.uId,
          pageNo: this.pageNumThree,
          pageSize: this.pageSize,
          status: 2
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.waitDeleverList = res.data.pageInfo.list
          this.allPagesThree = res.data.pageInfo
          // 遍历订单，得到订单商品的主图
          this.waitDeleverList.forEach(item => {
            this.$axios({
              url: 'goodsPicture/findMainPicByGoodsId/' + item.goods.gId,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'mainPic', result.data.object.gpAddress)
              }
            }).catch(error => {
              console.log(error)
            })
            this.$axios({
              url: 'users/findById/' + item.goods.gUid,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'uAvatar', result.data.object.uAvatar)
              }
            }).catch(error => {
              console.log(error)
            })
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 待发货分页
    changePageThree (index) {
      // 加载更多，页码改变的回调，返回改变后的页码
      this.pageNumThree = index
      this.findWaitOrder()
    },
    // 分页根据订单状态查询待收货订单列表
    findConfirmOrder () {
      this.$axios({
        url: 'orders/findByStatusBySell/',
        method: 'get',
        params: {
          uId: this.uId,
          pageNo: this.pageNumFour,
          pageSize: this.pageSize,
          status: 3
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.waitConfirmGoods = res.data.pageInfo.list
          this.allPagesFour = res.data.pageInfo
          // 遍历订单，得到订单商品的主图
          this.waitConfirmGoods.forEach(item => {
            this.$axios({
              url: 'goodsPicture/findMainPicByGoodsId/' + item.goods.gId,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'mainPic', result.data.object.gpAddress)
              }
            }).catch(error => {
              console.log(error)
            })
            this.$axios({
              url: 'users/findById/' + item.goods.gUid,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'uAvatar', result.data.object.uAvatar)
              }
            }).catch(error => {
              console.log(error)
            })
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 待收货分页
    changePageFour (index) {
      // 加载更多，页码改变的回调，返回改变后的页码
      this.pageNumFour = index
      this.findConfirmOrder()
    },
    // 分页根据订单状态查询退款中订单列表
    findRefundIng () {
      this.$axios({
        url: 'orders/findByStatusBySell/',
        method: 'get',
        params: {
          uId: this.uId,
          pageNo: this.pageNumFive,
          pageSize: this.pageSize,
          status: 5
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.refundIngList = res.data.pageInfo.list
          this.allPagesFive = res.data.pageInfo
          // 遍历订单，得到订单商品的主图
          this.refundIngList.forEach(item => {
            this.$axios({
              url: 'goodsPicture/findMainPicByGoodsId/' + item.goods.gId,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'mainPic', result.data.object.gpAddress)
              }
            }).catch(error => {
              console.log(error)
            })
            this.$axios({
              url: 'users/findById/' + item.goods.gUid,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'uAvatar', result.data.object.uAvatar)
              }
            }).catch(error => {
              console.log(error)
            })
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 退款中分页
    changePageFive (index) {
      // 加载更多，页码改变的回调，返回改变后的页码
      this.pageNumFive = index
      this.findRefundIng()
    },
    // 分页根据订单状态查询已取消订单列表
    findCancel () {
      this.$axios({
        url: 'orders/findByStatusBySell/',
        method: 'get',
        params: {
          uId: this.uId,
          pageNo: this.pageNumSix,
          pageSize: this.pageSize,
          status: 0
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.cancelList = res.data.pageInfo.list
          this.allPagesSix = res.data.pageInfo
          // 遍历订单，得到订单商品的主图
          this.cancelList.forEach(item => {
            this.$axios({
              url: 'goodsPicture/findMainPicByGoodsId/' + item.goods.gId,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'mainPic', result.data.object.gpAddress)
              }
            }).catch(error => {
              console.log(error)
            })
            this.$axios({
              url: 'users/findById/' + item.goods.gUid,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'uAvatar', result.data.object.uAvatar)
              }
            }).catch(error => {
              console.log(error)
            })
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 已取消分页
    changePageSix (index) {
      // 加载更多，页码改变的回调，返回改变后的页码
      this.pageNumSix = index
      this.findCancel()
    },
    // 分页根据订单状态查询已退款订单列表
    findRefunded () {
      this.$axios({
        url: 'orders/findByStatusBySell/',
        method: 'get',
        params: {
          uId: this.uId,
          pageNo: this.pageNumSeven,
          pageSize: this.pageSize,
          status: 6
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.refundedList = res.data.pageInfo.list
          this.allPagesSeven = res.data.pageInfo
          // 遍历订单，得到订单商品的主图
          this.refundedList.forEach(item => {
            this.$axios({
              url: 'goodsPicture/findMainPicByGoodsId/' + item.goods.gId,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'mainPic', result.data.object.gpAddress)
              }
            }).catch(error => {
              console.log(error)
            })
            this.$axios({
              url: 'users/findById/' + item.goods.gUid,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'uAvatar', result.data.object.uAvatar)
              }
            }).catch(error => {
              console.log(error)
            })
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 已退款分页
    changePageSeven (index) {
      // 加载更多，页码改变的回调，返回改变后的页码
      this.pageNumSeven = index
      this.findRefunded()
    },
    // 分页根据订单状态查询交易成功订单列表
    findSuccess () {
      this.$axios({
        url: 'orders/findByStatusBySell/',
        method: 'get',
        params: {
          uId: this.uId,
          pageNo: this.pageNumEight,
          pageSize: this.pageSize,
          status: 4
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.successList = res.data.pageInfo.list
          this.allPagesEight = res.data.pageInfo
          // 遍历订单，得到订单商品的主图
          this.successList.forEach(item => {
            this.$axios({
              url: 'goodsPicture/findMainPicByGoodsId/' + item.goods.gId,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'mainPic', result.data.object.gpAddress)
              }
            }).catch(error => {
              console.log(error)
            })
            this.$axios({
              url: 'users/findById/' + item.goods.gUid,
              method: 'get'
            }).then(result => {
              if (result.data.code === 200) {
                // vue给对象新增属性并触发视图更新
                this.$set(item, 'uAvatar', result.data.object.uAvatar)
              }
            }).catch(error => {
              console.log(error)
            })
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 交易成功分页
    changePageEight (index) {
      // 加载更多，页码改变的回调，返回改变后的页码
      this.pageNumEight = index
      this.findSuccess()
    },
    handleReset (name) {
      this.$refs[name].resetFields()
    },
    // 根据订单id查询订单退款详情
    findRefundDetail (oId) {
      this.newRefund = ''
      this.modal2 = true
      this.$axios({
        url: 'orderRefund/findByOrderId/' + oId,
        method: 'get',
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          if (res.data.object.orStatus === 0) {
            res.data.object.orStatus = '退款申请中'
          } else {
            res.data.object.orStatus = '退款成功'
          }
          this.newRefund = res.data.object
        }
      }).catch(error => {
        console.log(error)
      })
    },
    // 同意退款申请，支付宝退款给买家，修改订单状态为已退款
    agreeRefund () {
      this.$axios({
        url: 'alipay/refund',
        method: 'get',
        params: {
          orId: this.newRefund.orId,
          parentNo: this.newRefund.orders.oParentNo,
          alipayNo: this.newRefund.orders.oAlipayNo,
          price: this.newRefund.orPrice,
          reason: this.newRefund.orReason
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        if (res.data.code === 200) {
          // 退款成功，修改订单状态为已退款
          this.$axios({
            url: 'orders/updateOrderStatus',
            method: 'get',
            params: {
              oId: this.newRefund.orOid,
              status: 6
            },
            headers: {
              Authorization: localStorage.getItem('token')
            }
          }).then(res => {
            if (res.data === true) {
              this.$Message.success('退款成功')
            }
          }).catch(error => {
            console.log(error)
          })
        }
      }).catch(error => {
        console.log(error)
      })
    }
  }
}
</script>

<style scoped>
.pad {
    margin-right: 5px;
}
.order-info p {
    margin-bottom: 8px;
}
.order-info h6 {
    font-size: 15px;
}
.order-detail {
    padding: 10px;
}
.realy-price {
    font-size: 13px;
}
.userinfo-order span {
    font-size: 13px;
}
.page-all{
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
    margin-top: 1.5rem;
}
.myPublish-container {
    min-height: 480px;
}
.myPublish-info {
    margin-top: 50px;
}
.myPublish-item {
    margin: 5px 5px 10px 5px;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 0 0 4px #b8b8b8;
}
.userinfo-order {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
.userinfo {
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
}
.userinfo a {
    display: block;
}
.userinfo img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-right: 10px;
}
.userinfo .nickName {
    font-size: 12px;
    color: #515a6e;

}
.order-status>span {
    color: #ef4238;
    font-size: 11px;
}
.goodsinfo-price {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e8eaec;
    padding-bottom: 8px;
}
.goodsinfo {
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    max-width: 83%;
}
.goodsinfo a {
    display: block;
    color:#515a6e;
    font-size: 14px;
}
.goodsinfo .title {
    display: block;
    color:#515a6e;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
    font-size: 14px;
}
.goodsinfo img {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    margin-right: 10px;
}
.price {
    font-size: 13px;
    color:#ef4238;
}
.info-place {
    width: 100%;
    padding: 6px 0 0 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
}
.user-msg-img {
    font-size: 12px;
}
.user-msg-img img {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid #efefef;
  box-sizing: border-box;
}
/* .order-place {
    width: 200px;
} */
.order-place .status {
    display: inline-block;
    padding: 3px 6px;
    border-radius: 15px;
    border:1px solid #ef4238;
    color:#ef4238;
    margin-right: 10px;
    font-size: 11px;
}
.order-place .detail {
    display: inline-block;
    padding: 3px 6px;
    border-radius: 15px;
    border:1px solid #28a7f1;
    color:#28a7f1;
    margin-right: 10px;
    font-size: 11px;
}
.cancel {
    display: inline-block;
    padding: 3px 6px;
    border-radius: 15px;
    border:1px solid #f1a128;
    color:#f1a128;
    margin-right: 10px;
    font-size: 11px;
}
.refund {
    display: inline-block;
    padding: 3px 6px;
    border-radius: 15px;
    background: #ef4238;
    color:#fff;
    margin-right: 10px;
    font-size: 11px;
}
.ivu-dropdown-rel a {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    line-height: 20px;
    text-align: center;
    color:#515a6e;
    border:1px solid #515a6e;
}
</style>
